<template>
  <div>
    <!-- 通用header -->
    <JudgeCommonHeader v-if="awardsInfo.awardsType === 0" :active-stage="activeName" />

    <!-- scx专用header -->
    <ScxInitialHeader v-if="awardsInfo.awardsType === 1 && activeName === 'initial'" />
    <ScxFinalHeader v-if="awardsInfo.awardsType === 1 && activeName === 'final'" />

    <!-- 通用 -->
    <el-tabs v-loading="loading" v-model="activeName" style="min-height: 300px">
      <el-tab-pane
        v-if="stageRoundInfos?.length === 2"
        :label="t('judgeScene.tab.initial')"
        name="initial"
      >
        <JudgeWrapper v-if="initialStage" :awards-id="awardsId" :stage="initialStage" />
      </el-tab-pane>
      <el-tab-pane
        v-if="stageRoundInfos?.length > 0"
        :label="t('judgeScene.tab.final')"
        name="final"
        :disabled="!isFinalEnable"
      >
        <JudgeWrapper v-if="finalStage" :awards-id="awardsId" :stage="finalStage" />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script setup lang="ts">
/** 评选现场 列表 */
import ScxInitialHeader from './scx/ScxInitialHeader.vue'
import ScxFinalHeader from './scx/ScxFinalHeader.vue'
import { ReviewSceneApi, StageRoundVO } from '@/api/awards/reviewscene'
import { InstanceApi, InstanceVO } from '@/api/awards/instance'
import JudgeWrapper from './components/JudgeWrapper.vue'
import JudgeCommonHeader from './components/JudgeCommonHeader.vue'

defineOptions({ name: 'JudgeScene' })

const route = useRoute()
const router = useRouter() // 路由对象
const message = useMessage() // 消息弹窗
const { t } = useI18n() // 国际化

const activeName = ref('initial')

const isFinalEnable = computed(() => {
  if (awardsInfo.value.preliminaryEvaluation) {
    // 评选状态 1=未开始 2=初评进行中 3=初评结束 4=终评进行中 5=终评结束
    return awardsInfo.value.judgeStatus >= 3
  } else {
    return true
  }
})

const initialStage = computed(() => {
  if (stageRoundInfos.value?.length === 2) {
    return stageRoundInfos.value?.[0]
  } else {
    return null
  }
})

const finalStage = computed(() => {
  if (stageRoundInfos.value?.length === 2) {
    return stageRoundInfos.value?.[1]
  } else if (stageRoundInfos.value?.length === 1) {
    return stageRoundInfos.value?.[0]
  } else {
    return null
  }
})

const loading = ref(false)

const awardsInfo = ref<InstanceVO>({} as InstanceVO)
const stageRoundInfos = ref<StageRoundVO[]>()
const getInfo = async () => {
  loading.value = true
  const [awardsInfoRes, stageRoundInfosRes] = await Promise.all([
    // 读取评奖基本信息
    InstanceApi.getInstance(awardsId.value),
    // 读取阶段和轮次信息信息
    ReviewSceneApi.getStageRound(awardsId.value)
  ])
  awardsInfo.value = awardsInfoRes
  stageRoundInfos.value = stageRoundInfosRes
  if (stageRoundInfos.value?.length === 2) {
    // 两个阶段的额外判断一下现在是哪个阶段
    if (isFinalEnable.value) {
      // 终评阶段
      activeName.value = 'final'
    } else {
      // 初评阶段
      activeName.value = 'initial'
    }
  } else {
    activeName.value = 'final'
  }
  loading.value = false
}

const awardsId = ref('')
/** 初始化 **/
onMounted(() => {
  if (!route.params.instanceId) {
    router.push('/awards/instance')
    return
  }
  awardsId.value = route.params.instanceId as string
  getInfo()
})

provide('awardsInfo', awardsInfo)
</script>

<style lang="scss" scoped>
:deep(.vxe-cell .el-button + .el-button) {
  margin-left: 0;
}

:deep(.el-tabs__header.is-top) {
  padding-left: 10px !important;
}
</style>
